<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>IQ: Rooms List</title>
<link type="text/css" rel="stylesheet"
	href="bootstrap/css/bootstrap.min.css">
	<link type="text/css" rel="stylesheet"
	href="bootstrap/css/font-awesome.css">
<script type="text/javascript" language="javascript"
	src="//twitter.github.com/bootstrap/assets/js/jquery.js"></script>
<script type="text/javascript" language="javascript"
	src="bootstrap/js/bootstrap.js"></script>
<link type="text/css" rel="stylesheet"
	href="bootstrap/css/bootstrap.min.css">
<script type="text/javascript" language="javascript"
	src="rooms/rooms.nocache.js"></script>
</head>

<body>
	<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1'
		style="position: absolute; width: 0; height: 0; border: 0"></iframe>
	<div id="main"
		style="margin: 0 auto; width: 900px; height: 700px; background-color: white;">
		<h2 style="text-align: center;">List of rooms:</h2>
		<div id="table"></div>
		<hr>
		<div id="addRoom">
			<h2 style="text-align: center;">Add new room:</h2>
			<div style="float: left; width: 500px;">
				<form class="form-horizontal" action="javascript:void(0);">
					<fieldset>
						<legend>Enter settings:</legend>
						<div class="control-group">
							<label class="control-label" for="name">Name:</label>
							<div class="controls">
								<input id="name" type="text" style="width: 330px"
									placeholder="Please be moderate.">
							</div>
						</div>
						<div class="control-group">
							<label class="control-label" for="name">Subjects:</label>
							<div class="controls">
								<div id="active"></div>
								<p class="help-block">Select subjects of the room on the
									right</p>
							</div>
						</div>
						<div class="control-group">
							<label class="control-label">Available question types:</label>
							<div class="controls">
								<label class="checkbox"> <input type="checkbox" id="t1">Text
								</label> <label class="checkbox"> <input type="checkbox" id="t2">Image
								</label> <label class="checkbox"> <input type="checkbox" id="t3">Audio
								</label> <label class="checkbox"> <input type="checkbox" id="t4">Map
								</label>
							</div>
						</div>
						<div class="form-actions">
							<button id="create" class="btn">Create the room</button>
						</div>
					</fieldset>
				</form>
				<div id="message" style="width: 300px; margin: 0 auto;"></div>
			</div>
			<div id="allLabels"
				style="overflow: auto; padding-left: 100px; height: 500px;">
				<p>
				<p>
			</div>
		</div>
	</div>

</body>
</html>